<template>
	<div class="img-layer" @click="close">
		<img :src="src" />
	</div>
</template>

<script>
	export default{
		name:'ViewImg',
		props:{
			src:{
				type:String,
				default:''
			}
		},
		methods:{
			close(){
				this.$emit('close')
			}
		}
	}
</script>

<style scoped lang="scss">
	.img-layer {
		position: fixed;
		z-index: 999999;
		top: 0;
		left: 0;
		background: rgba(0, 0, 0, 0.7);
		width: 100%;
		height: 100%;
		overflow: hidden;
		img {
			max-width: 100%;
			max-height: 100%;
			display: block;
			position: absolute;
			left: 0;
			right: 0;
			top: 0;
			bottom: 0;
			margin: auto;
			z-index: 1000;
		}
	}
</style>